<template>
  <div>
    <el-dialog title="选择测评" :visible.sync="isAddMeasurement" width="40%" :before-close="handleClose" :close-on-click-modal='false'>
      <el-tabs v-model="activeName">
        <el-tab-pane :label="'平台推荐组合（'+this.planNum+'）'" name="plan">
          <div class="table">
            <simple-table :tableConfig="tableConfig" :tableData="tableData" @noRadio="noRadio"></simple-table>
          </div>
        </el-tab-pane>
        <el-tab-pane :label="'单个测评量表（'+this.planNum2+'）'" name="singleScale">
          <div class="table">
            <simple-table :tableConfig="tableConfig2" :tableData="tableData2" @handleSelectionChange="handleSelectionChange"></simple-table>
          </div>
        </el-tab-pane>
      </el-tabs>
      <span slot="footer" class="dialog-footer">
        <el-button @click="handleClose">取 消</el-button>
        <el-button type="primary" @click="handleClose">确 定</el-button>
      </span>
    </el-dialog>
  </div>
</template>
<script>
import simpleTable from '@/components/table.vue'
import {APIPLANGETCOMBINATIONORGAUGENUMBER, APICOMBINATIONGETALL, APIPLANGETALLSCALE} from '@/common/api.js'
export default {
  components: {
    simpleTable
  },
  props: ['isAddMeasurement'],
  data () {
    return {
      activeName: 'plan',
      planNum: '',
      planNum2: '',
      tableConfig: {
        load: false,
        size: 'small', // 表格大小
        style: 'width:100%', // 表格宽度
        align: 'center',
        selection: false,
        border: true,
        config: [
          {name: 'ID', id: 'radio', width: '60px'},
          {name: '序号', type: 'index', width: '60px'},
          {id: 'title', name: '组合名称'},
          {id: 'number', name: '题量'},
          {id: 'summary', name: '简介'}
        ]
      },
      tableConfig2: {
        load: false,
        size: 'small', // 表格大小
        style: 'width:100%', // 表格宽度
        align: 'center',
        selection: true,
        border: true,
        config: [
          // {name: '选择', id: 'radio', width: '60px'},
          {name: '序号', type: 'index', width: '60px'},
          {id: 'title', name: '量表名称'},
          {id: 'number', name: '题量'},
          {id: 'summary', name: '简介'}
        ]
      },
      tableData: [],
      tableData2: [],
      radioData: []
    }
  },
  created () {
    this.tableList()
  },
  methods: {
    tableList () {
      APIPLANGETCOMBINATIONORGAUGENUMBER().then((res) => {
        this.planNum = res.data.recommend_number
        this.planNum2 = res.data.scale_number
      }).catch((err) => {
        this.$message.error(err.msg)
      })
      APICOMBINATIONGETALL().then((res) => {
        this.tableData = res.data.list
        // this.planNum = res.data.number
      }).catch((err) => {
        this.$message.error(err.msg)
      })
      APIPLANGETALLSCALE().then((res) => {
        this.tableData2 = res.data
      }).catch((err) => {
        this.$message.error(err.msg)
      })
    },
    handleClose (done) {
      this.$emit('noAddMeasurement', {val: this.radioData})
    },
    noRadio (val) {
      this.radioData = []
      this.radioData.push(val.val)
    },
    handleSelectionChange (val) {
      this.radioData = val.val
    }
  }
}
</script>
